<template>
  <el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="'从文件导入数据'"
             append-to-body width="820px">
    <el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
      <el-upload
        ref="upload"
        :limit="1"
        :before-upload="beforeUpload"
        :auto-upload="true"
        :headers="headers"
        :on-success="handleSuccess"
        action=""
        :http-request="doSubmit"
      >
        <el-button slot="trigger" size="small" type="primary" style="margin-right:10px;">选取文件</el-button>
        <span slot="tip" class="el-upload__tip">请上传excel，ID列务必置为空，且不超过100M</span>
      </el-upload>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="text" @click="cancel">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
    import {
        insertByExcel
    } from '@/api/GeneratorCodeConfig.js'
    import {getToken} from '@/utils/auth'
    export default {
        components: {},
        data() {
            return {
                loading: false, dialog: false,
                form: {},
                headers: {'Authorization': 'Bearer ' + getToken()}
            }
        },
        methods: {
            cancel() {
                this.resetForm()
            },
            beforeUpload(file) {
                let isLt2M = true
                isLt2M = file.size / 1024 / 1024 < 100
                if (!isLt2M) {
                    this.$message.error('上传文件大小不能超过 100MB!')
                }
                this.loading = false
                return isLt2M
            },
            handleSuccess(response, file, fileList) {
                //this.bodyContainer = response
                //this.$refs.upload.clearFiles()
                //this.resetForm()
            },
            resetForm() {
                this.dialog = false
                this.$refs['form'].resetFields()
                this.$refs.upload.clearFiles()
                this.form = {
                    tableName: '',
                    generatorType: 1
                }
            },
            doSubmit(item) {
                let ttFile = item.file;
                console.log(ttFile);
                const form = new FormData()
                // 文件对象
                form.append('file', ttFile)
                insertByExcel(form).then(res => {
                    if (res.hasError) {
                        this.$notify({
                            title: res.error.message,
                            type: 'fail',
                            duration: 2500
                        })
                    } else {
                        this.$notify({
                            title: res.data,
                            type: 'success',
                            duration: 2500
                        })
                    }
                }).catch(err => {
                    this.loading = false
                    console.log(err.response.data.message)
                })
            }
        }
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
  /deep/ .el-input-number .el-input__inner {
    text-align: left;
  }
</style>
